<template>
  <div class="options">
    <Header :title="{name: '设置'}" />
    <ul>
      <li @click="turnPage('SetNewPass')">设置密码</li>
      <!--
      	<li @click="turnPage('Feedback')">意见反馈</li>
      -->
    </ul>
    <div class="bottom-box">
      <div class="btn-exit" @click="onLogout">退出登录</div>
    </div>
  </div>
</template>
<script>
import Header from "@/components/Header";
import { mapState,mapMutations,mapGetters,mapActions } from 'vuex'
export default {
  name: 'options',
  components: {
    Header
  },
  data() {
    return {}
  },
  methods: {
    ...mapMutations(['course1','course2']),
    // on event
    onLogout() {
      localStorage.removeItem("adminToken");
      localStorage.removeItem("user_id");
      this.$router.push("/login")
    },
    // other
    turnPage(name) {
      this.$router.push({
        name
      });
    }
  },
  mounted() {
    this.course1()
  }
};
</script>
<style scoped lang="scss">
@import "@/assets/CSS/index.scss";
.options {
  background-color:#F0F2F5;
  width:100%;
  height:100%;
  ul {
    padding:20px;
    background-color:#fff;
    margin-top:20px;
  }
  .bottom-box {
    overflow: hidden;
    background-color: #fff;
    height: 150px;
    .btn-exit {
      background-color: $theme_color;
      color: #fff;
      width: 90%;
      height: 40px;
      margin: 60px auto;
      border-radius: 8px;
      font-size: 15px;
      text-align: center;
      line-height: 40px;
    }
  }
}
</style>